require(['/js/config.js'],()=>{
    require(['template','header','protect','footer'],(template,header)=>{
        class Shooping{
            constructor(){
                this.render()
                this.checkChange()
                this.AllCheckChange()
                // this.setAllCheckStatus()
                this.subAndPlus()
                this.delete()
                this.gotoMall()
            }
            render(){
                return new Promise (resolve =>{
                const cart = localStorage.getItem('cart')
                if(cart){
                    $('#empty').hide()
                    $('#shoppingCart').show()
                    this.cart = JSON.parse(cart)
                    $('#cartBody').html(template('cartBodyTemplate',{items:this.cart}))
                }
                else{
                    $('#shoppingCart').hide()
                    $('#empty').show()
                }
                this.calcTotalMoney()
                this.setAllCheckStatus()
                resolve()
                    })
            }
            calcTotalMoney(){
                let totalMoney = this.cart.reduce((money,item)=>{
                   if(item.checked) money+=(item.price*item.count)
                    return money
                },0)
                $('#Paymoney').html(totalMoney.toFixed(2))

            }
            checkChange(){
                const _this = this
                $('.checks').on('click',function(){
                    const id = $(this).parents('tr').data('id')
                    _this.cart = _this.cart.map(item=>{
                        if(item.id==id) item.checked=$(this).prop('checked')
                        return item
                    })
                    localStorage.setItem('cart',JSON.stringify(_this.cart))
                    // _this.render()
                    _this.calcTotalMoney()
                    _this.setAllCheckStatus()
                })

            }
            setAllCheckStatus(){
                const isAllCheck = this.cart.every(item=>{
                    return (item.checked==true)
                })
                $('#all-check').prop('checked',isAllCheck)
            }
            AllCheckChange(){
                
                $('#all-check').on('click',()=>{
                    const allCheckStatus = $('#all-check').prop('checked')
                    $('.checks').prop('checked',allCheckStatus)
                    this.cart = this.cart.map(item=>{
                         item.checked=allCheckStatus
                         return item
                    })
                    localStorage.setItem('cart',JSON.stringify(this.cart))
                    // this.render()
                    this.calcTotalMoney()
                    
                })
            }
            subAndPlus(){
                const _this=this
                $('.plus').on('click',function(){
                    const newNum = Number($(this).prev().html())+1
                    const id = $(this).parents('tr').data('id')
                    $(this).prev().html(newNum)
                    
                    _this.cart = _this.cart.map(item=>{
                        if(item.id==id) item.count=newNum
                        return item
                    })
                    localStorage.setItem('cart',JSON.stringify(_this.cart))
                    _this.smallCount($(this),newNum)
                    _this.calcTotalMoney()
                    header.calcCartTotal()
                })
                $('.sub').on('click',function(){
                    const nowNum = Number($(this).next().html())
                    
                    const id = $(this).parents('tr').data('id')
                    if(nowNum>1){
                        $(this).next().html(nowNum-1)
                        _this.cart = _this.cart.map(item=>{
                            if(item.id==id) item.count=nowNum-1
                            return item
                        })
                        localStorage.setItem('cart',JSON.stringify(_this.cart))
                        
                        const num=nowNum-1
                        _this.smallCount($(this),num)
                        _this.calcTotalMoney()
                        header.calcCartTotal()
                    }
                })
            }
            smallCount(that,num){
                const smallCountNum=that.parents('td').next().children().html().slice(1)*num
                that.parents('td').next().next().children('span').html(`￥${smallCountNum}`)               
            }
            plussmallCount(that,num){
                const smallCountNum=that.parents('td').next().children().html().slice(1)*num
                that.parents('td').next().next().children('span').html(`￥${smallCountNum}`)               
            }
            delete(){
                const _this=this
                $('.delete').on('click',function(){
                    const id = $(this).parents('tr').data('id')
                    if(confirm('确定要删除吗')){
                        $(this).parents('tr').remove()
                        _this.cart = _this.cart.filter(item=>{
                            return item.id!=id
                        })
                        localStorage.setItem('cart',JSON.stringify(_this.cart))
                        const currentCart=localStorage.getItem('cart')
                        
                        if(currentCart=='[]'){
                            localStorage.removeItem('cart')
                        _this.render()
                        } 
                        // window.reload()
                        _this.calcTotalMoney()


                    }
                })
            }
            gotoMall(){
                $('#gotoMall,#continue').on('click',()=>location.replace('/html/mall.html'))
            }
            
        }
        return new Shooping()
    })
})